<template>
  <div>
      <button type="button" @click="test01">跨域请求演示</button>
      <button type="button" @click="test02">axios模块的get请求</button>
      <button type="button" @click="test03">axios模块的post请求</button>
  </div>
</template>

<script>
   export default {
        name:"testAjax",
        methods:{
            test01(){//跨域请求演示
                $.ajax({
                   url:"/exam/testAjax/test01",
                   type:"post",
                   data:{"name":"rock"},
                   contentType:"application/x-www-form-urlencoded",
                   success:function(rs){
                     console.log(rs);
                   },
                   error:function(rs){
                      console.log("服务器连接错误");
                   }
                })
            },
            test02(){//get请求
                  this.$http.get(
                                "/testAjax/test01",
                                 {params:{"name":"rock"}}
                            ).then(function(rs){
                              console.log(rs.data);
                            }).catch(function(rs){
                              console.log("服务器连接错误");
                            })
            },
            test03(){//post请求

                 this.$http.post(
                               "/testAjax/test02",
                                this.$qs.stringify({"name":"rock"})
                           ).then(function(rs){
                             console.log(rs.data);
                           }).catch(function(rs){
                             console.log("服务器连接错误");
                           })

            },

        }
   }

</script>

<style>
</style>
